<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:fn="http://java.sun.com/jsp/jstl/functions"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://xmlns.jcp.org/jsf/passthrough">
<h:body>
	<ui:composition template="/template.xhtml">
		<ui:define name="body">
			<f:event listener="#{userMenu.selectM1G1}" type="preRenderView"></f:event>
			<!-- NAVIGATOR -->
        	<ui:insert>
        		<ui:include src="nav.xhtml" />
        	</ui:insert>
        	
			<div class="container">
				<!-- Main component for a primary marketing message or call to action -->
				<div class="row">
					<div class="col-xs-8">
						<div class="page-header">
						  <h1>新增分享 <small>保存后新条目会被置为未审核状态，不会立即发布</small></h1>
						</div>
							
						<h:messages infoClass="alert alert-success" errorClass="text-danger"></h:messages>
						<h:form id="editor_form" styleClass="form-horizontal" p:role="form">
							<div class="form-group">
								<label for="title" class="col-sm-2 control-label">标题</label>
								<div class="col-sm-10">
									<h:inputText id="title" value="#{candidateStoryEditAction.story.title}" styleClass="form-control" label="标题" p:placeholder="请输入标题" />
								</div>
							</div>
							<div class="form-group">
								<label for="classify" class="col-sm-2 control-label">分类</label>
								<div class="col-sm-10">
									<h:selectOneMenu p:id="classify" value="#{candidateStoryEditAction.story.categoryId}" styleClass="form-control" style="height: 34px;">
										<f:selectItems value="#{candidateStoryEditAction.categorySelectionList}"></f:selectItems>
									</h:selectOneMenu>
								</div>
							</div>
							<div class="form-group">
								<label for="content" class="col-sm-2 control-label">正文</label>
								<div class="col-sm-10">
									<h:inputTextarea p:id="content" value="#{candidateStoryEditAction.story.content}" styleClass="form-control" label="正文内容" p:placeholder="请输入正文内容" />
								</div>
							</div>
							<div class="form-group">
								<label for="comment" class="col-sm-2 control-label">评论</label>
								<div class="col-sm-10">
									<h:inputTextarea id="comment" value="#{candidateStoryEditAction.story.comment}" styleClass="form-control" style="min-height: 100px;" label="评论内容" p:placeholder="请输入评论内容" />
								</div>
							</div>
							<div class="form-group">
								<label for="source" class="col-sm-2 control-label">来源</label>
								<div class="col-sm-10">
									<h:inputText id="item_source" value="#{candidateStoryEditAction.story.itemSource}" styleClass="form-control" p:placeholder="如：环球网" />
								</div>
							</div>
							<div class="form-group">
								<label for="comment" class="col-sm-2 control-label"></label>
								<div class="col-sm-10">
									<h:inputHidden value="#{candidateStoryEditAction.story.id}"></h:inputHidden>
									<button type="button" class="btn btn-default btn-lg btn-block" onclick="showPreviewModel();">
										<span class="glyphicon glyphicon-picture" /> 预览
									</button>
									<h:commandLink styleClass="btn btn-success btn-lg btn-block" action="#{candidateStoryEditAction.saveCandidateStory}">
										<span class="glyphicon glyphicon-floppy-disk" /> 保存
									</h:commandLink>
								</div>
							</div>
		
						</h:form>
					</div>
					
					<!-- Right Panel -->
					<div class="col-xs-4 ">
						<!-- COMMON-INFO -->
        				<ui:insert><ui:include src="common-info.xhtml" /></ui:insert>
        				
						<div class="panel panel-primary">
							<div class="panel-heading">
					          <h3 class="panel-title">素材提交统计</h3>
					        </div>
							<ul class="list-group">
								<c:forEach items="#{candidateStoryEditAction.contributions}" var="data" varStatus="status">
									<li class="list-group-item">
									<c:if test="#{status.index lt 3}"><span class="label label-primary pull-right"><h:outputText value="#{data[1]}" /></span></c:if>
									<c:if test="#{not (status.index lt 3)}"><span class="label label-default pull-right"><h:outputText value="#{data[1]}" /></span></c:if>
									<h:outputText value="#{data[0]}" />
									</li>
								</c:forEach>
							</ul>
						</div>
						<div class="panel panel-primary">
							<div class="panel-heading">
					          <h3 class="panel-title">已发布文章分类统计</h3>
					        </div>
							<ul class="list-group">
								<c:forEach items="#{candidateStoryEditAction.categoryCount}" var="data" varStatus="status">
									<li class="list-group-item">
									<span class="label label-primary pull-right"><h:outputText value="#{data[1]}" /></span><h:outputText value="#{data[0]}" />
									</li>
								</c:forEach>
							</ul>
						</div>
					</div>
				</div><!-- end row -->
			</div><!-- end container -->
			
			<div class="modal fade" id="reviewModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			  <div class="modal-dialog">
			    <div class="modal-content">
			      <div class="modal-header">
			        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
			        <h4 class="modal-title" id="myModalLabel"><h:outputText id="preview_title" /></h4>
			        <p><br /><h:outputText id="preview_comment" /></p>
			      </div>
			      <div class="modal-body">
			        <p><h:outputText id="preview_content" /></p>
			        <p>来源：<h:outputText id="source" /></p>
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-default btn-lg" data-dismiss="modal"><span class="glyphicon glyphicon-off"></span> 关闭</button>
			      </div>
			    </div><!-- /.modal-content -->
			  </div><!-- /.modal-dialog -->
			</div><!-- /.modal -->
		</ui:define>
		<ui:define name="insert-js-at-the-end">
			<script src="/iForward/framework/ckeditor/ckeditor.js"></script>
			<script type="text/javascript">
				CKEDITOR.replace('content', {
					uiColor : '#428bca',
					language : 'zh-cn',
					height : '600px'
				});
				CKEDITOR.config.toolbarGroups = [
					{ name: 'document',    groups: [ 'mode', 'document', 'doctools' ] },
					{ name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
					{ name: 'links' },
					{ name: 'tools' },
					{ name: 'insert' },
					{ name: 'others' },
					{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
					{ name: 'colors' },
					{ name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align' ] },
					{ name: 'styles' }
                   ];
				function showPreviewModel(){
					$('#preview_title').html($('#editor_form\\:title').val());
					$('#preview_comment').html($('#editor_form\\:comment').val());
					$('#preview_content').html(CKEDITOR.instances.content.getData());
					$('#source').html($('#editor_form\\:item_source').val());
					$('#reviewModal').modal('show');
				}
			</script>
		</ui:define>
	</ui:composition>
</h:body>
</html>